<include file="Common:header"/>
<style>
.login_background{
	/* background:#6ceab7;  */
	width: 100%;
	text-align: center;
	height: 48%; 
	border:0px solid black;
}
body{
	background-color: #F1F1F1;
}
.login_bth{
    width: 95%;
    border-radius: 6px;
    margin-top: 20px;
    line-height: 22px;
    padding: 10px;
    font-size: 14px;
    color: #fff;
    background-color: #2ebc82;
}
.pwd_reon{
	margin-top:20px;
}
.pwd_reon a{
	display: inline-block;
	width: 100%;
	text-align: center;
	color:#277BC4;
}
.site_option{
	margin-top: 20px;
	text-align: center;
	color:#6E7175;
}
.not_reg{
	margin-top:15px;
	font-weight:normal;
	color:#E86767;
	font-size: 15px;
}
.login_background{background-position: relative;}
.inptxt154{
	z-index: 10;
}
.clear_bth{
	width:11%;
	height:37px;
	background: url(__PUBLIC__/img/clear.png) no-repeat;
	background-position: 71% 52%;
	background-size: 71%;
	position: absolute;
	right:18px;
	top:84px;
	z-index:1000;
	display: none;
}
.clear_bth_pwd{
	width:11%;
	height:37px;
	background: url(__PUBLIC__/img/clear.png) no-repeat;
	background-position: 71% 52%;
	background-size: 71%;
	position: absolute;
	right:18px;
	top:143px;
	z-index:1000;
	display: none;
}
.getbtn{
		background-color: #69d0fe;
		color:#fff;
		border-radius: 5px;
		line-height: 30px;
		padding:0 7%;
	}
	.label_font{
		text-align: right;
	}
.kf_agreement {
    font-size: 13px;
    padding-bottom: 10px;
    margin: 4% 0 0 6%;
}
.read_text {
    cursor: pointer;
    background: url(__PUBLIC__/img/kf_uncheck.png) no-repeat 0 4px;
    background-size: 14px 14px;
    padding-left: 17px;
    height: 18px;
    margin-left: -16px;
}
.read_text.on {
    background: url(__PUBLIC__/img/kf_checked.png) no-repeat 0 4px;
    background-size: 14px 14px;
}
.kf_agreement span {
    color: #00a7e1;
}
.kf_agreement_text{
	font-size:13px;
	background:#fff;
	line-height:24px;
	padding-bottom: 40px;
}
.kd_text{
	text-align:center;
	padding-bottom:10px;
}
.kd_main_text{
	padding:14px 10px 10px 10px;
}
/*.kf_agreement_header{
	top:0;
    position: fixed;
    height: 50px;
    line-height: 50px;
    color: #fff;
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #e54040;
    text-align: center;
	width:100%;
}*/
.kf_agreement_header img{
	margin-top: 5px;
    vertical-align: top;
    height: 20px !important;
}
.kf_agreement_header a{
	position: absolute;
    display: inline-block;
    height: 30px;
    padding: 10px;
}
.close_cs{
	line-height: 30px;
    vertical-align: top;
    margin: 0 0 0 5px;
    color: #FFF;
    font-size: 16px;
}
.kf_agreement_header {
    position: relative;
    height: 50px;
    line-height: 50px;
    color: #fff;
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #69d0fe;
    text-align: center;
    padding: 0 65px;
}
</style>
<body class="new_user">
	<div class="header"><{$opt['site_name']}></div>
	<div class="form_content">
		<div class="form-input">
			<div class="user_name">
				<label for="mobile" class="label_font">手机号码：</label>
				<input class="input_e_i" type="tel" pattern="\d*" name="mobile" placeholder="填写11位手机号" value="<{$user_mobile}>">
			</div>
		</div>
		<!--
		<div class="form-input">
			<div class="user_name">
				<label for="captcha" class="label_font">验证码：</label>
				<input class="input_e_i" type="tel" name="captcha" placeholder="短信验证码" style="width:41%;">
				<div style="float:right;width:35%;line-height:35px;">
					<button id="getCaptcha" class="getbtn" onclick="get_reset_captcha(this)">
						获取短信验证码
					</button>
				</div>
				
			</div>
		</div>-->
		<div class="kf_agreement" style="display: block;">
		    <p class="read_text">我已阅读并同意<span>《用户服务协议》</span></p>
		</div>
		<div class="max_box">
			<div class="form-input">
				<button class="input_e_s_no" id="submit_button" onclick="_login(this);" data-switch="0">
					登&nbsp;记&nbsp;手&nbsp;机&nbsp;号&nbsp;码
				</button>
			</div>
		</div>
	</div>
<!-- 	<div class="content">
		<div class="site_option">
			粤IPC备15091564号-3
		</div>
	</div> -->
	<div style="display: none;" class="kf_agreement_text">
	    <div>
	        <div class="kf_agreement_header">
	            用户服务协议
	            <a href="javascript:;" class="back">
			<img src="__PUBLIC__/img/back.png"><span class="close_cs">关闭</span>
	            </a>
	        </div>
	        <div class="kd_main_text">
				<{$deal}>
	        </div>  
	    </div>
	</div>
</body>
</html>
<script>

function _login(obj){
	var _switch = $(obj).attr('data-switch');
	if(_switch == '0'){
		return false;
	}
	var mobile = $('input[name="mobile"]').val();
	var captcha = $('input[name="captcha"]').val();
	if(mobile == ''){
		layer.open({
			content: "请输入手机号码！"
		})
		return false;
	}
	if(captcha == ''){
		layer.open({
			content: "请输入验证码！"
		})
		return false;
	}
	var reg = /^((\(\d{2,3}\))|(\d{3}\-))?1[3|4|5|7|8]\d{9}$/;
	if(!reg.test(mobile)){
		layer.open({
		content: "请输入有效的手机号码！"
	})
	document.form1.mobile.focus();
	return false;
	}
	
	$.post("<{:U('Home/Login/new_user')}>",{"mobile":mobile,"captcha":captcha},function(r){
		if(r.status == '1'){
			window.location.href = r.url;
		 }else{
			layer.open({
				content: r.msg
			})
		 }
	},'json');
	
	return false;
}

</script> 
<script type="text/javascript">
	function get_reset_captcha(obj){
		var mobile = $('input[name="mobile"]').val();
		if($(obj).attr('readonly')){
			return false;
		}
		if (!(/^1[2|3|4|5|6|7|8|9][0-9]\d{8}$/.test($.trim(mobile))))
		{
			layer.open({
				content:"手机号码格式错误",
			})
			return false;
		}
		$(obj).attr('readonly','readonly');
		$.ajax({
			type: "POST",
			url: "<{:U('Home/Login/sendResetCheckMobile')}>",
			data: "mobile="+mobile+"",
			success: function(r){
				if(r.status == '-1'){
					layer.open({
						content:r.msg,
					})
					$(obj).removeAttr('readonly');
				}
				else
				{
					layer.open({
						content:r.msg,
					})
					getCaptchaSuccess();
				}
			}
		});
	}

	// 重新获取手机验证码
	function getCaptchaSuccess()
	{
		var duration = 59;	// 倒计时长 秒
		var obj = $('#getCaptcha');
		obj.attr('readonly', 'readonly');
		obj.addClass('readonlyBtn');
		obj.html('重新发送 ('+duration+' s)');
		var timing = setInterval(function(){
			if (duration > 0){
				duration = duration - 1;
				obj.html('重新发送 ('+ duration +' s)');
			}else{
				obj.html('重新获取验证码');
				obj.removeAttr('readonly');
				obj.removeClass('readonlyBtn');
				
				//清除循环定时器
				window.clearInterval(timing);
			}

		},1000);
	}

	//阅读协议勾选框
	$(".kf_agreement p").on("click", function(){
	    var _this = $(this);
	   //没有勾选的时候
	   if(_this.hasClass("on")){
			_this.removeClass("on")
			$("#submit_button").removeClass("input_e_s");
			$("#submit_button").addClass("input_e_s_no");
			$("#submit_button").attr("data-switch",'0');

	   }else{
	   		//勾选的时候
			_this.addClass("on");
			$("#submit_button").removeClass("input_e_s_no");
			$("#submit_button").addClass("input_e_s");
			$("#submit_button").attr("data-switch",'1');
	   }
	   
	});
	//阅读协议内容
	$(".kf_agreement span").on("click", function(){
	    $(".header,.form_content").hide();
	    $(".kf_agreement_text").show();
	});
	//关闭协议
	$(".back").on("click", function(){
	    $(".kf_agreement_text").hide();
	    $(".header,.form_content").show();
	});


</script>